<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
<meta charset="UTF-8">
<title>课程信息</title>
<link th:href="@{/css/courseInfo.css}" href="../static/css/courseInfo.css" rel="stylesheet" type="text/css"/>
<link th:href="@{/css/courseSearch.css}" href="../static/css/courseSearch.css" rel="stylesheet" type="text/css"/>
<link th:href="@{/lib/layui/css/layer.css}" href="../static/lib/layui/css/layer.css" rel="stylesheet" type="text/css"/>
<script th:src="@{/lib/layui/layui.js}" src="../static/lib/layui/layui.js" rel="stylesheet"></script>
<script th:src="@{/lib/jquery/jquery-3.2.1.min.js}" src="../static/lib/jquery/jquery-3.2.1.min.js" rel="stylesheet"></script>
</head>
<body>
<header th:replace="head::head"></header>
<div class="body">
    <div class="product">
        <div class="product-box">
            <div class="product-sx">
                <a th:href="'/page/player?path='+${course.videoAddress}+'&courseNum='+${course.courseNum}">
                    <img th:src="${course.photoAddress}" class="product-img">
                    <span class="product-name" th:text="${course.courseName}"></span>
                </a>
                <span class="product-price">
                    <span class="price" th:text="${course.overview}"/>
                </span>
                <div class="product-amount">
                    <div class="product_gw">
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
<input type="hidden" th:value="${course.courseId}" id="course-id">
<div class="learn-btn">
    <a th:href="'/page/player?path='+${course.videoAddress}+'&courseNum='+${course.courseNum}"
       class="moco-btn moco-btn-red moco-btn-lg J-learn-course">开始学习
    </a>
</div>
<div class="course-info-menu ">

    <div class="w">
        <ul class="course-menu">
            <li>
                <a id="commentOn" class="moco-change-big-btn " href="/coursescore/1114">用户评价</a>
            </li>
        </ul>
    </div>
</div>
<div class="course-info-main clearfix w">

    <div class="content-wrap clearfix">
        <div class="content">


            <div class="evaluate clearfix">
                <div class="evaluate-item clearfix">
                    <div class="evaluate-title">
                        评分：
                    </div>
                    <div id="test1"></div>
                </div>
                <div class="evaluate-item clearfix">
                    <div class="textarea-box">
                        <textarea name="evaluation" id="evaluation" placeholder="写下你的对该课程的评价..."></textarea>
                        <span class="num-tip"></span>
                    </div>
                </div><!--textarea-box end-->
                <div class="ctrl-box clearfix">
                    <div class="moco-btn moco-btn-red moco-btn-lg release-evaluation r" id="submit">提交</div>
                    <div class="errtip l"></div>
                </div><!--ctrl-box end-->
            </div><!--evaluate end-->
            <div class="evaluate-succ">
                <i class="icon-tick2"></i>评价成功，感谢您对本课程的支持！
                <span>+1 积分</span>
            </div><!--evaluate-succ end-->
.
            <div class="evaluation-list">
                <div class="evaluation evaluate" id="137727" th:each="evalute : ${evaluateList}">
                    <div class="evaluation-con">
                        <div class="content-box">
                            <div class="user-info clearfix">
                                <a href="javascript:;" class="username" th:text="${evalute.userName}">只想做你一个人太阳</a>
                                <div class="star-box">
                                    <i class="icon-star2 active"></i>
                                    <i class="icon-star2 active"></i>
                                    <i class="icon-star2"></i>
                                    <i class="icon-star2"></i>
                                    <i class="icon-star2"></i>
                                    <span th:text="${evalute.grade}+'分'">4分</span>
                                </div>
                            </div><!--user-info end-->
                            <p class="content" th:text="${evalute.content}">很好很好很好很好很好很好很好很好</p>
                            <div class="info clearfix">
                                <span class="time r" th:text="'时间:'+${#dates.format(evalute.creatTime, 'yyyy-MM-dd')}">
                                    时间：2019-04-18</span>
                            </div>
                        </div><!--content end-->
                    </div><!--evaluation-con end-->
                    <div class="do-reply">
                        <div class="textarea-box">
                            <textarea name="teacher-reply" class="teacher-do-reply"
                                      placeholder="写下你对评价的回复..."></textarea>
                            <span class="num-tip"></span>
                        </div><!--textarea-box end-->
                        <div class="ctrl clearfix">
                            <p class="errtip"></p>
                            <div class="btn-box">
                                <div class="moco-btn cancel">取消</div>
                                <div class="moco-btn moco-btn-red sure" data-comment-id="137727">回复</div>
                            </div>
                        </div><!--ctrl end-->
                    </div><!--do-reply end-->
                </div>
            </div><!--container end-->
        </div>
    </div>
</div>
<script type="application/javascript">
    (function () {
        layui.config({
            base: '/js/admin/' //静态资源所在路径
            // base: '../static/js/admin/' //静态资源所在路径
        }).extend({
            index: 'index' //主入口模块
        }).use('index');
        layui.use(['rate'], function () {
            var rate = layui.rate;
            //显示文字
            rate.render({
                elem: '#test1'
                ,half:true
                , value: 3.5 //初始值
                , text: true //开启文本
            });
        });
        function bindAction(){
            $('#submit').click(function () {
                evaluation({
                    content:$('#evaluation').val()
                    ,grade:5
                    ,courseId:$('#course-id').val()
                })
            });
        }

        function evaluation(param) {
            $.ajax({
                url: '/interface/evaluate/insert'
                , type: 'POST'
                , data: param
                , success: function (data) {
                    location.reload()
                }
            })
        }
        bindAction();
    })()

</script>
</body>
</html>